@charset "utf-8";

@import "common/reset";
@import "common/common";

.web{
    .details_top{
        height: 35px;
        line-height: 35px;
        width: 100%;
        background: #e8e8e8;
        color: #535353;
        font-size:12px; 
        margin-top: 30px;
        margin-bottom: 30px;
        a{
            color:#000;
            &:hover{
                color:#e2231a;
            }
        }       
    }
    .details_center{
        margin: 60px auto;
        position: relative;
        .fl{
            .details_left_posi{
                width: 618px;
                top: 0;
                position: absolute;
                dl{ 
                    position: absolute;
                    dd{
                        position: absolute;
                        width: 544px;
                        height: 544px;
                        overflow: hidden;
                        img{
                           width: 100%;
                           height: 100%;
                        }
                    }
                }
                .contorl_img{
                    width: 558px;
                    height: 87px;
                    margin-top: 20px;
                    position: relative;
                    top: 538px;                   
                    ul{
                        height: 87px;
                        margin: auto;
                        width:490px;
                        overflow: hidden;
                        white-space: nowrap;
                        li{
                            display: inline-block;
                            border: 1px solid #CFD8E1;               
                            margin-right: 8px;
                            height: 86px;
                            width: 86px;
                            cursor: pointer;
                            transition: all .8s ease-in-out;
                        }
                        .border_li{
                            border: 1px solid #7B7B7B;
                        }                       
                    }
                    .fl,.fr{
                            position: absolute;
                            top: 33px;
                            width: 20px;
                            text-align: center;
                            line-height: 30px;
                            height: 30px;
                            background: #eee;
                            color: #d5d6d5;
                            cursor: pointer;
                            font-weight: bold;
                            font-size: 18px;
                        }
                        .fl{
                            left: 0;                            
                        }
                        .fr{
                            right: 0;
                            margin-right: 7px;
                        }                    
                }
                .details_review{
                    width: 530px;
                    margin-top: 20px;
                    position: absolute;
                    top: 635px;
                    
                    .review_bottom{
                        font-size: 13px;
                        margin-top: 5px;
                        position: relative;
                        height: 30px;
                        line-height: 30px;
                        padding-right:20px;
                        span{
                            color: #707070;
                        }
                    }
                    .collect{
                        display: inline-block;
                        padding-right: 5px;
                        cursor: pointer;
                        i{
                            color: #b5b5b5;
                            font-size: 18px;
                            vertical-align: middle;
                        }
                        em{
                            font-size:10px; 
                            &:hover{
                                color:#e21100;
                            }
                        }
                    }
                    .share{
                        background: #e21100;
                        width: 88px;
                        height: 23px;
                        line-height: 23px;
                        text-align: center;
                        border-radius: 15px;
                        display: inline-block;
                        color: #fff;
                        margin-right: 5px;
                        cursor: pointer;
                        position: relative;
                        &:hover>.share_img{
                            display: block;
                        }
                        .share_img{
                            height:30px;
                            line-height: 30px;
                            width: 160px;
                            border: 1px solid #D9D8D6;
                            position: absolute;
                            bottom: -30px;
                            left: 0;
                            display: none;
                            padding: 0px 10px;
                            .icon-weibo{
                                font-size: 19px;
                                &:hover{
                                    color: #C40B06;
                                }
                            }
                            .icon-kongjian{
                                font-size: 22px;
                                &:hover{
                                    color:#F39800;
                                }
                            }
                            .icon-renrenwang{
                                &:hover{
                                    color: #005CE6;
                                }
                            }
                            .icon-icon2{
                                &:hover{
                                    color: #FFE57D;
                                }
                            }
                            i{
                                color: #555;
                                font-size: 21px;
                                padding-left: 5px;
                                vertical-align: middle;
                                &:hover{
                                    transform: translateY(-1px);
                                }
                            }
                        }
                    }
                    a{                    
                        color: #e2231a;
                        &:hover{
                            text-decoration: underline;
                        }
                    }
                }
            }
            
        }
        .fr{
            font-size: 14px;
            .detail_title{
                width: 578px;
                font-size: 30px;
                overflow: hidden;
                white-space: nowrap;
            }
            .detail_titow{
                font-size: 14px;
                margin-top: 17px;
                line-height: 22px;
                border-bottom: #dcdcdc solid 1px;
                padding-bottom: 12px;
                overflow: hidden;
                white-space: nowrap;
            }
            .container-title{
                font-size: 18px;
                margin-top: 15px;
                span{
                    font-size: 13px;
                    color: #7d7d7d;
                    margin-left: 12px;
                }
            }
            .padding_b{
                margin-bottom: 15px;
            }
            .promotion{
                margin-top: 10px;
                padding-bottom: 10px;
                em{
                    font-size: 13px;
                    border: 1px solid #e2231a;
                    display: inline-block;
                    padding: 3px 4px;
                    border-radius: 3px;
                    color: #e2231a;
                    margin-right: 5px;
                }
                span{
                    padding-left: 5px;
                }
                .phone_price{
                    color: #e2231a;
                    padding-top: 10px;
                }                
            }
            .item{
                width: 278px;
                height: 53px;
                line-height: 53px;
                border-radius: 5px;
                border: 1px solid #e2231a;
                margin-bottom: 10px;
                margin-right: 10px;
                cursor: pointer;
                font-size: 14px;
                overflow: hidden;
                margin-top: 12px;
                img{
                    vertical-align: middle;
                }
                span{
                    color: #535353;
                    font-size: 12px;
                }
                &:hover>span{
                    color:#e2231a;
                }
            }
            .choice{
                cursor: pointer;
                width: 578px;
                text-align: center;
                height: 53px;
                line-height: 53px;
                border-radius: 5px;
                border: 1px solid #c9c9c9;
                margin-bottom: 10px;
                span{
                    max-width: 506px;
                    display: inline-block;
                    white-space: nowrap;
                    overflow: hidden;

                }
            }
            .choice_on{
                border: 1px solid #e2231a;
            }
            .option_choose{
                width: 278px;
                height: 53px;
                border-radius: 5px;
                border: 1px solid #c9c9c9;
                margin-bottom: 10px;
                margin-right: 10px;
                cursor: pointer;
                font-size: 14px;
                overflow: hidden;
                margin-top: 12px;
                float: left;
                margin-top: 8px;
                margin-right: 10px;
                margin-bottom: 10px;
                img{
                    float: left;
                }
                .option{
                    width: 212px;
                    margin-left: 50px;
                }
                .option_choose_top{
                    float: left;
                    font-size: 14px;
                    padding-top: 7px;
                    overflow: hidden;
                    white-space: nowrap;
                }
                .option_choose_bottom{
                    float: left;
                    width: 212px;
                    span{
                        padding-right: 16x;
                        font-size: 13px;
                        em{
                            font-size: 12px;
                            color: #E2231A;
                        }
                    }
                    .fr{
                        display: inline-block;
                        a{
                            color: #535353;
                            font-size: 12px;
                            vertical-align: middle;
                        }
                    }
                    
                }
            }
            .intem_line{
                line-height:53px ;
                padding-left: 5px;
                span{
                    display: inline-block;
                    float: left;
                }
                .left_fuwu{
                    line-height:13px;
                    margin-top: 20px;
                    color: #fff;
                    background:#a70303;
                    font-size: 12px;
                    padding: 1px;
                    margin-right: 10px;
                }
                .center_fuwu{                   
                    overflow: hidden;
                    width: 165px;
                    white-space: nowrap;
                }
                .price_fuwu{
                    float: right;
                    padding-right: 20px;
                }
            }
            .combo{
                text-align: center;
                em{
                    padding-right:7px;
                }
                i{
                    color: #7D7D7D;
                    vertical-align: middle;
                    padding-right: 5px;
                }
            }
        }
        
    }
    .detail_body{
        width: 100%;
        padding-top: 40px;
        ul{
            height: 40px;
            line-height: 40px;
            margin-top: 450px;
            border-bottom: 1px solid #CCCCCC;
             border-top: 1px solid #CCCCCC;
            width: 1200px;
            margin: 0 auto;
            .onmove{
                color: #E2231A;
            }
            li{
                cursor: pointer;
                padding-right: 40px;
                float: left;
                font-size: 14px;
                
            }
        }
        //图片页
        .all_bg_img{
//          display: none;
//          max-width: 1735px;
            margin-top: 20px;
            margin: auto;
            overflow: hidden;
            img{
                display: block;
                width: 100%;
            }
        }
        //配置信息
        .configuration{
            display: none;
            .configuration_title{
                font-size: 26px;
                padding-top: 20px;
                margin: 0 30px 15px 0;
            }
            .row_con{
                height: 30px;
                line-height: 30px;
                font-size: 14px;
                span{
                    display: inline-block;
                }
                .row_left,.border_row_left{
                    width: 150px;
                    white-space: nowrap;
                    overflow: hidden;
                }
                .row_right,.border_row_right{
                    width: 976px;
                    margin-left: 64px;
                    white-space: nowrap;
                    overflow: hidden;                    
                }
                .border_row_left,.border_row_right{
                    border-bottom: 1px solid #DCDCDC;
                    padding-top: 30px;
                    display: inline-block;
                }
            }           
        }
        //评论
        .review{
            margin-top: 20px;
            display: none;
            .review_rate{
                float: left;
                width: 180px;
                text-align: left;
                font-size: 24px;
                em{
                    color: #e2231a;
                }
            }
            .check_review{
                vertical-align: middle;
                width: 100%;
                .span_all{
                    cursor: pointer;
                    height: 30px;
                    line-height: 30px;
                    display: inline-block;
                    .check_none{
                    margin-top: 8px;
                    width: 13px;
                    height: 14px;
                    line-height: 14px;
                    padding-right: 10px;
                    display: inline-block;
                    background: url(../img/details/radio.jpg) no-repeat;
                    }
                    .check_on{
                        margin-top: 8px;
                        width: 13px;
                        height: 14px;
                        line-height: 14px;
                        padding-right: 10px;
                        display: inline-block;
                        background: url(../img/details/check.jpg) no-repeat;
                    }
                    .all{
                        padding:0 25px 0 15px;
                        display: inline-block;
                    }
                }
                .fr{
                    padding-right: 15px;
                    height: 30px;
                    line-height: 30px;
                    input{
                        vertical-align: middle;
                        margin-right: 5px;
                    }                    
                }
                .buy_y{
                    margin-top: 20px;
                    margin-left: 180px;
                }                
            }
            .took_buy{
                margin-top: 50px;
                .took_buy_left{
                    width: 180px;
                    float: left;
                    border-top: #e9e9e9 solid 1px;
                    padding-top: 50px;
                    line-height: 25px;
                    overflow: hidden;
                    p{
                        margin-top: 5px;
                        font-size: 14px;
                    }
                    .iconfont{
                        color: #f3ac00;
                        font-size: 20px;
                    }
                }
                .took_buy_right{
                    width: 987px;
                    float: right;
                    border-top: #e9e9e9 solid 1px;
                    padding-top: 50px;
                    line-height: 25px;
                    .service_info{
                        height: auto;
                        padding: 19px 14px;
                        background: #e8e8e8;
                        font-size: 14px;
                        margin-top: 40px;
                        line-height: 20px;
                        p{
                            color:#e2231a;
                            margin-bottom: 10px;
                        }
                    }
                }
            }
        }
    }
    .fix_footer{
        background: #e8e8e8;
        height: 80px;
        width: 100%;
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 999;
    }
}
